<template>
  <header @click="changeTitle">
      <h1>{{title}}</h1>
  </header>
</template>

<script>
export default {
  name: 'app-header',
  props:{
    title:{
      type:String
    }
  },
  data(){
      return{
      }
  },
  methods:{
    changeTitle:function(){
        //使用$emit(函数名,参数);注册函数
        this.$emit("titleChanged","子向父传值");
    }
  }
}
</script>

<style scoped>
header{
    background: lightgreen;
    padding: 10px;
}
h1{
    color: #222;
    text-align: center;
}
</style>
